HTML

Der speedata Publisher kann HTML-Inhalte verarbeiten und als PDF ausgeben. Dieses Kapitel beschreibt die verschiedenen Möglichkeiten, HTML zu verwenden, und die unterstützten Funktionen. Diese sind noch in Entwicklung. Die HTML Unterstützung wird kontinuierlich verbessert.

HTML verwenden

Es gibt mehrere Möglichkeiten, HTML-Inhalte in das Layout einzubinden:

Direktes HTML in Output

Am einfachsten ist die Verwendung des <HTML>-Befehls direkt innerhalb von <Output>:

<Output>
  <HTML>
    <h1>Überschrift</h1>
    <p>Ein Absatz mit <b>fettem</b> und <i>kursivem</i> Text.</p>
    <ul>
      <li>Punkt 1</li>
      <li>Punkt 2</li>
    </ul>
  </HTML>
</Output>

HTML aus Daten mit select

HTML-Inhalte können aus der Datendatei mit dem select-Attribut geladen werden:

<Output>
  <HTML select="content" />
</Output>

Wenn das HTML als maskierter Text (z.B. <p>) oder in einem CDATA-Abschnitt gespeichert ist, wird der <HTML>-Befehl es korrekt parsen.

HTML in Paragraph

HTML kann auch innerhalb von <Paragraph>-Elementen in einem <Textblock> oder <Text> verwendet werden. Das ist nützlich, wenn HTML mit anderen Publisher-Elementen gemischt werden soll:

<Record element="Paragraph">
  <PlaceObject>
    <Textblock>
      <Paragraph>
        <Value select="sd:decode-html(.)" />
      </Paragraph>
    </Textblock>
  </PlaceObject>
</Record>

Mit Daten, die HTML in CDATA enthalten:

<Paragraph><![CDATA[<ol><li>Erster Punkt</li><li>Zweiter Punkt</li></ol>]]></Paragraph>

XPath-Ersetzung mit expand-text

Bei Inline-HTML können XPath-Ausdrücke in geschweiften Klammern verwendet werden, wenn expand-text="yes" gesetzt ist:

<Output>
  <HTML expand-text="yes">
    <p>Artikel <b>{@nr}</b> kostet {$preis} Euro.</p>
  </HTML>
</Output>

Für literale geschweifte Klammern {{ und }} verwenden.

Unterstützte HTML-Elemente

Die folgenden HTML-Elemente werden unterstützt:

  • Überschriften: <h1> bis <h6>
  • Absätze: <p>
  • Textformatierung: <b>, <i>, <u>, <code>, <kbd>, <span>
  • Links: <a href="…​">
  • Listen: <ul>, <ol>, <li>
  • Tabellen: <table>, <thead>, <tbody>, <tr>, <th>, <td>
  • Zeilenumbrüche: <br>

CSS-Styling

HTML-Elemente können mit CSS gestaltet werden. CSS kann über den <Stylesheet>-Befehl eingebunden werden:

<Stylesheet>
  h1 { color: blue; font-size: 24pt; }
  p { margin-bottom: 12pt; }
  .highlight { background-color: yellow; }
</Stylesheet>

Oder CSS aus einer Datei laden:

<Stylesheet filename="styles.css" />

Unterstützte CSS-Eigenschaften

Der speedata Publisher unterstützt eine Teilmenge von CSS-Eigenschaften, darunter:

  • Schrifteigenschaften: font-family, font-size, font-weight, font-style
  • Texteigenschaften: color, text-align, text-decoration, line-height
  • Box-Modell: margin, padding, border, width, height
  • Hintergrund: background-color
  • Listenstil: list-style-type, list-style

Eine vollständige Liste der unterstützten CSS-Eigenschaften ist im CSS-Abschnitt unter CSS zu finden.

Tabellen in HTML

HTML-Tabellen werden vollständig unterstützt, einschließlich Kopf- und Fußzeilen, die bei Seitenumbrüchen wiederholt werden:

<HTML>
  <table>
    <thead>
      <tr><th>Name</th><th>Preis</th></tr>
    </thead>
    <tbody>
      <tr><td>Produkt A</td><td>10,00</td></tr>
      <tr><td>Produkt B</td><td>20,00</td></tr>
    </tbody>
  </table>
</HTML>

Tabellen können sich über mehrere Seiten erstrecken, wobei der <thead>-Inhalt oben auf jeder Seite wiederholt wird.

Teststatus

Im Repository gibt es unter qa/htmloutput eine Reihe von HTML/CSS-Tests, die die verschiedenen Funktionen und deren Unterstützung im speedata Publisher überprüfen.

Funktioniert

  • break-after – Seitenumbrüche nach HTML-Elementen
  • break-before – Seitenumbrüche vor HTML-Elementen
  • color – Textfarben mit unterschiedlichen Angabeformaten
  • font-style-weight – Schriftstil (italic) und Schriftgewicht (bold) sowie Kombinationen
  • list-style-type – Verschiedene Listenmarker-Typen (disc, circle, square, decimal, alpha, roman) (benötigt evtl. Schriftart mit entsprechenden Glyphen)
  • table-border – Tabellenzellen mit Rahmen und verschiedenen Formatierungen
  • table-border-collapse – Unterschiede zwischen border-collapse: separate und collapse
  • tablebreak – Mehrseitige Tabellen mit wiederholendem Tabellenkopf
  • text-align – Textausrichtung (left, right, center, justify)
  • vertical-align – Hochgestellter und tiefgestellter Text (prüfen: Schriftgröße)
  • white-space – Leerzeichenbehandlung (normal, pre)

Funktioniert teilweise

Tests, die erfolgreich sind, aber möglicherweise noch Verbesserungen benötigen:

  • border-color – Rahmenfarben mit Einzelfarbensetzung pro Seite und currentcolor
  • border-radius – Abgerundete Ecken mit einheitlichem und individuellen Radius-Werten
  • border-shorthand – Kurzschreibweise für Rahmen mit verschiedenen Stilen, Breiten und Farben
  • border-width – Rahmenbreiten in unterschiedlichen Einheiten und mit individuellen Werten pro Seite
  • box-margin – Äußere Abstände mit Kurzschreibweisen und Einzelwerten pro Seite
  • box-padding – Innere Abstände mit Kurzschreibweisen und Einzelwerten pro Seite
  • font-size – Verschiedene Schriftgrößenangaben (pt, px, em, rem, %, Schlüsselwörter). oberer Rand auf 2. Seite ist zu klein
  • list-style-position – Listenmarkerposition (outside, inside) Die Marker sind höchstwahrscheinlich nicht richtig platziert.
  • text-decoration – Textdekorationen (underline, line-through, verschiedene Stile und Farben) Nur underline wird unterstützt.

Defekt

Tests, die derzeit nicht korrekt funktionieren:

  • background-color – Hintergrundfarben mit unterschiedlichen Angabeformaten (Named Color, Hex, RGB)
  • border-style – Verschiedene Rahmenstile (none, solid, dashed, dotted, double, groove, ridge, inset, outset)
  • box-width-height – Breite und Höhe mit Prozent-, Pixel- und Em-Angaben
  • line-height – Verschiedene Zeilenhöhen-Werte (normal, Zahlenwert, Prozent, Punkte)